<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基金详情</title>
        <link href="https://cdn.jsdelivr.net/npm/simple-datatables@latest/dist/style.css" rel="stylesheet" />
        <link href="../static/assets/css/styles.css" rel="stylesheet" />
        <script src="https://use.fontawesome.com/releases/v6.1.0/js/all.js" crossorigin="anonymous"></script>
       <script src="static/assets/js/echarts.min.js"></script>
</head>
<body>
  <p style="color: #0c63e4;size: 30px">基金净值走势图</p>
 <div id="main" style="width: 1000px;height:400px"></div>
      <script type="text/javascript">
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var app = {};

var option;



option = {
    tooltip: {
    trigger: 'axis'
  },
  xAxis: {
    type: 'category',
    data: {{ date|tojson }}
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: {{ num }},
      type: 'line'
    }
  ]
};

if (option && typeof option === 'object') {
    myChart.setOption(option);
}

        </script>
<div class="card-body">
  <table id="datatablesSimple">
                                    <thead>
                                        <tr>
                                            <th>净值日期</th>
                                            <th>单位净值</th>
                                            <th>累计净值</th>
                                            <th>日增长率</th>
                                            <th>申购状态</th>
                                            <th>赎回状态</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for fund in funds %}
                                           <tr>
                                               <td>{{ fund[0]}}</td>
                                               <td>{{ fund[1]}}</td>
                                           <td>{{ fund[2]}}</td>
                                           <td>{{ fund[6]}}</td>
                                           <td>{{ fund[7]}}</td>
                                           <td>{{ fund[8]}}</td>
                                        </tr>
                                       {% endfor %}
                                    </tbody>
                                </table>
</div>
       <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
        <script src="../static/assets/js/scripts.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js" crossorigin="anonymous"></script>
        <script src="../static/assets/demo/chart-area-demo.js"></script>
        <script src="../static/assets/demo/chart-bar-demo.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/simple-datatables@latest" crossorigin="anonymous"></script>
        <script src="../static/assets/js/datatables-simple-demo.js"></script>

</body>
</html>